<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <title>图片上传</title>
</head>
<style>

</style>

<body>
    <form action="">
        <table>
            <tr>
                <td>
                    <img src="./img_input_preview.png" alt="" height="115px" height="115px">
                    <p>
                        排序： 0
                        <input type="file" accept="image/*">
                    </p>
                </td>
                <td>
                    <img src="./img_input_preview.png" alt="" height="115px" height="115px">
                    <p>
                        排序： 0
                        <input type="file" accept="image/*">
                    </p>
                </td>
                <td>
                    <img src="./img_input_preview.png" alt="" height="115px" height="115px">
                    <p>
                        排序： 0
                        <input type="file" accept="image/*">
                    </p>
                </td>
                <td>
                    <img src="./img_input_preview.png" alt="" height="115px" height="115px">
                    <p>
                        排序： 0
                        <input type="file" accept="image/*">
                    </p>
                </td>
                <td>
                    <img src="./img_input_preview.png" alt="" height="115px" height="115px">
                    <p>
                        排序： 0
                        <input type="file" accept="image/*">
                    </p>
                </td>
            </tr>
        </table>
    </form>
</body>
<script>
    img_input = document.querySelectorAll('input[type="file"]');
    img_input.forEach(function(input){
        input.addEventListener('change',function(){
            readURL(this);
            console.log(this);
        })
    });

    function readURL(input){
        if(input.files && input.files[0]){
                        console.log('file');

            var reader = new FileReader();
            reader.onload = function(e){
                img = input.parentNode.querySelector('img');
                img.setAttribute('src',e.target.result);
            }
        }else{
            console.log('no file');
        }
    }

</script>

</html>